//1、随机一个字母显示到页面上
//声明一个全局变量。记录随机字母
var char;
var span = document.querySelector('span')
function getRandomCharacter() {
    var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'
    var random = Math.ceil(Math.random() * 35)
    char = str[random];
    console.log(char);
    //toUpperCase:转化为大写
    //toLowerCase:转化为小写
    span.innerHTML = char;
}
var right = 0;
var error = 0;
var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'
var random = Math.ceil(Math.random() * 35)
var char = str[random];
console.log(char);
var span = document.querySelector('span')
//toUpperCase:转化为大写
//toLowerCase:转化为小写
span.innerHTML = char;

//2、监听按键输入，进行字符对比
window.onkeyup = function (event) {
    console.log(event.key);
    var key = event.key;
    if (key.toUpperCase() == char.toUpperCase()) {
        console.log('对比成功');
        //再次随机一个字符
        getRandomCharacter();
        right++;
    } else {
        console.log('对比失败')
        //添加动画的样式类
        span.classList.add('animated', 'shake')
        span.style.color = 'yellow'
        error++;
        //延迟一秒删除动画样式类
        //setTimeout:延迟函数
        //para1：操作函数
        //para2：延迟事件；以毫秒为单位
        setTimeout(function () {
            span.classList.remove('animated', 'shake');
            span.style.color = 'black'
        }, 1000);
    }
    //计算真确率
    var rightRate = right / (right + error)
    var span2 = document.querySelector('div>span:nth-child(3)')
    span2.innerHTML = '正确次数是' + right + ',错误次数是' + error + '。正确率' + rightRate.toFixed(2)
}


//修改样式类的方法
//1)ele.classList.add('类名称'):在原有的样式类基础上添加新的样式类
//2)ele.className = '样式类的名称'：会把原有的样式类覆盖掉

//定时器：
//没隔一段时间，执行一次函数
// setInterval(function(){
//     console.log('----');
// },1000);